<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>疫情防控</title>
    <th:block th:include="include :: header('登录')"/>
    <link rel="stylesheet" th:href="@{/static/admin/css/other/login.css}"/>
    <!-- Meta -->
    <meta charset="utf-8"/>
    <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport">
    <meta content="ie=edge" http-equiv="x-ua-compatible">
    <meta content="Bootstrap Theme, Freebies, UI Kit, MIT license" name="keywords">
    <meta content="Bootstrap 4 Template by WebThemez" name="description">
    <meta content="webthemez.com" name="author">

    <!-- Favicon -->
    <link href="favicon.ico" rel="shortcut icon" type="image/x-icon">

    <!-- Styles -->

    <link rel="stylesheet" th:href="@{/static/assets/vendors/bootstrap/css/bootstrap.min.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/static/assets/vendors/font-awesome/css/fontawesome-all.min.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/static/assets/vendors/slick-carousel/slick.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/static/assets/vendors/ace-responsive-menu/ace-responsive-menu.css}"
          type="text/css"/>
    <link rel="stylesheet" th:href="@{/static/assets/vendors/aos/aos.css}">
    <link rel="stylesheet" th:href="@{/static/assets/css/theme.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/static/assets/css/styles.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/static/assets/css/login.css}" type="text/css">

</head>


<body>
<div class="hidden-xs hidden-sm nav-top bg-primary py-2">
    <div class="container">
        <div class="row">
            <div class="col-sm-6">
                <div class="nav-top-contact">
                    <!-- Social links -->
                    <ul class="list-inline text-center text-md-left mb-0">
                        <!--                        <li class="list-inline-item mx-2"><i class="fa fa-phone"></i> 0537-592</li>-->
                        <!--                        <li class="list-inline-item mx-2"><i class="fa fa-envelope" aria-hidden="true"></i>-->
                        <!--                            fangyi@bdmk.com-->
                        <!--                        </li>-->
                    </ul>
                </div>
            </div>
            <div class="col-sm-6 text-right">
                <ul class="list-inline text-center text-md-right mb-0">
                    <li class="list-inline-item mx-2" data-placement="top" data-toggle="tooltip"
                        title="Facebook">
                        <a href="#" target="_blank">
                            <i class="fab fa-facebook"></i>
                        </a>
                    </li>
                    <li class="list-inline-item mx-2" data-placement="top" data-toggle="tooltip"
                        title="Instagram">
                        <a href="#" target="_blank">
                            <i class="fab fa-instagram"></i>
                        </a>
                    </li>
                    <li class="list-inline-item mx-2" data-placement="top" data-toggle="tooltip"
                        title="Twitter">
                        <a href="#" target="_blank">
                            <i class="fab fa-twitter"></i>
                        </a>
                    </li>
                    <li class="list-inline-item mx-2" data-placement="top" data-toggle="tooltip"
                        title="Dribbble">
                        <a href="#" target="_blank">
                            <i class="fab fa-dribbble"></i>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
<!-- Header -->
<header class="main-header">
    <div style="margin-left: 50px;">
        <div class="logo">
            <img th:src="@{/static/assets/images/logo.png}"/>

        </div>
        <!-- Navbar -->

    </div>
</header>
<!-- End Navbar -->
<section class="wt-section hero-large position-relative overflow-hidden mt-md-2">
    <div class="hero-img bg-overlay" data-aos="fade-right" data-aos-delay="50"
         data-aos-easing="linear" data-overlay="0" style="background-image: url(/static/assets/img/bg3.png);"></div>
    <div class="container">
        <div class="row align-items-center my-5">
            <div class="col-md-8 py-5" data-aos="fade-left" data-aos-delay="100" data-aos-easing="linear">
                <!-- heading -->
                <h1 class="text-uppercase mb-4 display-4 font-weight-bolder">
                    新冠疫情防控信息管理系统
                </h1>

            </div>

            <div class="col-md-4">
                <form action="javascript:void(0);" class="layui-form">
                    <div class="login_m">
                        <div class="login_boder">

                            <div class="login_padding">
                                <h2>用户名</h2>
                                <label>
                                    <input class="txt_input txt_input2" hover name="username" placeholder="账 户 :  root"
                                           type="text"
                                           value="root">
                                </label>
                                <h2>密码</h2>
                                <label>
                                    <input class="txt_input" hover name="password" placeholder="密 码 :  zw"
                                           type="password"
                                           value="zw123654">
                                </label>
                                <h2>验证码</h2>
                                <!--                                <label>-->
                                <!--                                    <input type="text" name="captcha" placeholder="验证码 : " class="txt_input"-->
                                <!--                                           style="width: 150px">-->
                                <!--                                    &lt;!&ndash;                                <input placeholder="验证码 : " name="captcha" hover&ndash;&gt;-->
                                <!--                                    &lt;!&ndash;                                       class="code layui-input layui-input-inline"/>&ndash;&gt;-->
                                <!--                                    <img th:src="@{/captcha/captchaImage?type=char}" class="codeImage"-->
                                <!--                                         id="captchaImage"/>-->
                                <!--                                </label>-->
                                <div class="rem_sub">
                                    <!--                                    <div class="rem_sub_l">-->
                                    <!--                                        <input type="checkbox" name="checkbox" id="save_me">-->
                                    <!--                                        <label for="checkbox">记住</label>-->
                                    <!--                                    </div>-->

                                    <label>
                                        <input class="sub_button" lay-filter="login" lay-submit
                                               style="opacity: 0.7;" type="submit" value="登录">
                                    </label>
                                </div>
                            </div>

                        </div><!--login_boder end-->
                    </div><!--login_m end-->
                </form>
            </div>

        </div>
    </div>
</section>
<!-- End Header -->

<div class="hidden-xs hidden-sm nav-top bg-primary py-2">
    &nbsp;
    <div class="container">
        <div class="row">
            <div class="col-sm-6">
                <div class="nav-top-contact">
                    <!-- Social links -->
                    <ul class="list-inline text-center text-md-left mb-0">
                        <li class="list-inline-item mx-2"><i class="fa fa-phone"></i> 0537-5921866</li>
                        <li class="list-inline-item mx-2"><i aria-hidden="true" class="fa fa-envelope"></i>
                            fangyi-5921866@bdmk.com
                        </li>
                    </ul>
                </div>
            </div>

        </div>
    </div>
</div>
<th:block th:include="include :: footer"/>
<script>
    layui.use(['form', 'jquery', 'layer'], function () {
        let form = layui.form;
        let $ = layui.jquery;
        let layer = layui.layer;
        form.on('submit(login)', function (data) {
            $(".login").attr("disabled", "disabled")
            let loader = layer.load();
            $(".login").html("<i class='layui-icon layui-anim layui-anim-rotate layui-anim-loop layui-icon-loading' />");
            $.ajax({
                url: rootPath + '/admin/login',
                data: data.field,
                type: "post",
                dataType: 'json',
                success: function (result) {
                    if (result.code == 200) {

                        layer.msg(result.msg, {icon: 1, time: 1000}, function () {
                            location.href = rootPath + "/admin/index";
                        })
                    } else {
                        // layer.msg(result.msg, {icon: 2, time: 1000}, function () {
                        //     document.getElementById("captchaImage").src = rootPath + "/captcha/captchaImage?type=char&s=" + Math.random();
                        // });
                        $(".login").removeAttr("disabled");
                    }
                    $(".login").html("登 入")
                    layer.close(loader);
                }
            });
            return false;
        });

        // $("#captchaImage").click(function () {
        //     document.getElementById("captchaImage").src = rootPath + "/captcha/captchaImage?type=char&s=" + Math.random();
        // })
        // setInterval(function () {
        //     document.getElementById("captchaImage").src = rootPath + "/captcha/captchaImage?type=char&s=" + Math.random();
        // }, 30000);

        validateKickout();

    })


</script>
<script>
    if (window != top) {
        top.location.href = location.href;
    }

    function validateKickout() {
        if (getParam("kickout") == 1) {
            layer.alert("<font color='red'>您已在别处登录，请您修改密码或重新登录</font>", {
                    icon: 0,
                    title: "系统提示"
                },
                function (index) {
                    //关闭弹窗
                    layer.close(index);
                });
        } else if (getParam("sessionout") == 1) {
            layer.alert("<font color='red'>登录已过期，请重新登录</font>", {
                    icon: 0,
                    title: "系统提示"
                },
                function (index) {
                    //关闭弹窗
                    layer.close(index);
                });
        }
    }

    function getParam(paramName) {
        var reg = new RegExp("(^|&)" + paramName + "=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return decodeURI(r[2]);
        return null;
    }

</script>

<!-- JS Script Files -->
<!-- Global Vendor -->
<script th:src="@{/static/assets/vendors/jquery.min.js}"></script>
<script th:src="@{/static/assets/vendors/jquery.migrate.min.js}"></script>
<script th:src="@{/static/assets/vendors/popper.min.js}"></script>
<script th:src="@{/static/assets/vendors/bootstrap/js/bootstrap.min.js}"></script>
<script th:src="@{/static/assets/vendors/aos/aos.js}"></script>

<!-- Components Vendor  -->
<script th:src="@{/static/assets/vendors/slick-carousel/slick.min.js}"></script>
<script th:src="@{/static/assets/vendors/ace-responsive-menu/ace-responsive-menu.js}"></script>

<!--Plugin Initialize-->
<script th:src="@{/static/assets/js/global.js}"></script>
<script th:src="@{/static/assets/vendors/carousel.js}"></script>

<!-- END JAVASCRIPTS -->


</body>
</html>
